// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import fastClick from 'fastclick';
import VueAwesomeSwiper from 'vue-awesome-swiper';
import 'swiper/swiper-bundle.css';
import Vue from 'vue';
import App from './App'; // 省略后缀名.vue
import router from './router';
import './assets/styles/reset.css';
import './assets/styles/border.css';
import './assets/styles/iconfont.css';

Vue.config.productionTip = false;
fastClick.attach(document.body);
Vue.use(VueAwesomeSwiper);

/* eslint-disable no-new */
new Vue({
    el: '#app', // 挂载了项目根目录中的index.html的<div id="app"></div>
    router,
    components: { App }, // App局部组件
    template: '<App/>', // 把App这个局部组件显示在index.html页面上
});

// 路由就是根据网址的不同，返回给用户的内容不同

/**
 * 多页面应用的优缺点：
 * 1、每一次我们访问新的页面（页面跳转）的时候，后台都会返回一个“新”的html文档
 * 2、他的优点：首屏的时间快，因为整个只经历一次http请求
 * 3、         SEO(搜索引擎)效果好
 * 4、他的缺点：页面切换慢，因为每一次页面跳转的时候都会返回一个“新”的html文档
 *             假如网络不好，那么时间就会比较慢
 *
 * 单页面应用的优缺点
 * 1、第一次进入页面的时候会去请求一个HTML文档
 * 2、第二次的时候，它的JavaScript会感知你的URL的变化，JavaScript会动态的把
 *    当前的页面内容（DOM）清除掉，把下一个页面的内容（DOM）挂载（渲染）到上面，路由是前端来做
 * 3、优点：页面之间的切换快
 * 4、缺点：首屏时间会比较慢，SE0效果差（因为SEO它只识别HTML文档），不认识JavaScript文件，
 *         会使vue当页面应用在百度、谷歌等SEO的排名较后
 * 5、解决：服务端渲染ssr
 *  */
